import React, { Component } from 'react';
import { Form, Input, Button, Popover, InputNumber,Select } from 'antd';
import fetch from '../../../../utils/request';

const FormItem = Form.Item;

class TransTo extends Component {
  constructor() {
    super();
    this.state = {
      visible: false,
      inputValue :1
    };
  }
  toggleVisible() {
   const { record, form, handleSubmit, page } = this.props;
   this.setState({ visible: !this.state.visible }, () => {
      setTimeout(() => { this.props.form.resetFields(['toTrans', 'positionNo']); }, 0);
    });
  }
  
//batchSelectPositionNo(value) {
//  fetch.post('/haierp1/inventory/queryOnlineQuantity', { data: { id: value } }).then((res) => {
//      if (res.data.success) {
//          this.setState({
//                	inputValue:res.data.onlineQuantity
//          })
//      } 
//    });
//
//}
  
  submit() {
    const { record, form, handleSubmit, page } = this.props;
    form.validateFields((err, values) => {
      if (err) return;
      this.toggleVisible();
      this.props.dispatch({
        type: 'inventory/transTo',
        payload: { ...values, inventoryAreaId: record.id },
        cb() { handleSubmit(null, page); },
      });
    });
  }
  render() {
  	const p = this;
    const { record, form } = this.props;
    const { getFieldDecorator } = form;
    return (
      <Popover
        content={<Form>
          <div style={{ margin: '12px 0 12px' }}>商品名称：{record.itemName}</div>        
          <FormItem
                label="网购单"
                labelCol={{ span: 8 }}
                wrapperCol={{ span: 16 }}
              >
                {getFieldDecorator('storageDetailId', {
                  rules: [{message: '请选择网购单' }],
                })(
                  <Select  placeholder="请选择网购单" optionLabelProp="title"   getPopupContainer={trigger => trigger.parentNode} allowClear>
                    {record.purchaseStorageDetailList.map(el => <Option key={el.id} title={el.onlineNumber}>{el.onlineNumber}</Option>)}
                  </Select>)}
          </FormItem>
          <FormItem
            label="入仓数量"
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
          >
            {getFieldDecorator('toTrans', {
              initialValue: this.state.inputValue,
              rules: [{ required: true, message: '请输入' }],
            })(
              <InputNumber placeholder="请输入"/>,
            )}
          </FormItem>
          
          <FormItem
            label="货架号"
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
          >
            {getFieldDecorator('positionNo', {
              initialValue: record.positionNo,
              rules: [{ required: true, message: '请输入' }],
            })(
              <Input placeholder="请输入" />,
            )}
          </FormItem>
          
           <FormItem
            label="UPC码"
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
          >
            {getFieldDecorator('upc', {
              initialValue: record.upc,
            })(
              <Input placeholder="请输入" />,
            )}
          </FormItem>
          <Button size="small" type="primary" onClick={this.submit.bind(this)}>保存</Button>
        </Form>}
        title="在途入仓"
        trigger="click"
        style={{ minWidth: 200 }}
        visible={this.state.visible}
        onVisibleChange={this.toggleVisible.bind(this,record.id)}
      >
        <a href="javascript:void(0)" style={{ marginRight: 10 }}>在途入仓</a>
      </Popover>
    );
  }
}

export default Form.create()(TransTo);
